<template>
  <article class="page">
    <headerbar>
      出题记录
    </headerbar>

    <section class="frame-content-sub no-bg">
      <datePickComponent :selectDateList="selectDateList" @onDate="onDate" @onDateChange="onDateChange"></datePickComponent>
    </section>
  </article>
</template>

<script>
  import datePickComponent from '@/components/common/datePickComponent.vue'
  import moment from 'moment'
  export default {
    name: 'myQuestion',
    components: {datePickComponent},
    data () {
      return {
        swipeData: [],
        selectDateList: [],
        pageIndex: 1,
        tabIndex: 0,
        currentIndex: 0,
        year: '',
        _time: '',
        data: {},
        yearParam: '',
        monthParam: ''
      }
    },
    created () {
      this.loadData()
    },
    beforeRouteEnter (to, from, next) {
      next(vm => {
        if (to.name === 'myQuestion') {
          to.meta.keepAlive = true
          vm.$store.commit('addRoute', 'myQuestion')
        }
        next()
      })
    },
    beforeRouteLeave (to, from, next) {
      this.$route.meta.keepAlive = to.name === 'myQuestionDetail'
      if (this.$route.meta.keepAlive) {
        this.$store.commit('addRoute', 'myQuestion')
      } else {
        this.$store.commit('removeRoute', 'myQuestion')
        this.$destroy()
      }
      next()
    },
    methods: {
      goDateList () {
        if (window.android && window.android.openUrlAdapt) {
          window.android.openUrlAdapt('http://www.djhy.gov.cn:8680/party-center/exam/h5/calendar/index.do?access_token=' + this.tools.getToken())
        }
      },
      go (name) {
        this.$router.push({name: name})
      },
      /*选择了某一天*/
      onDate (dateStr) {
        dateStr = moment(`${dateStr} 00:00:00`).format('YYYY-M-D')
        if (!this.selectDateList.includes(dateStr)) return false
        this.$router.push({name: 'myQuestionDetail', query: {date: dateStr}})
      },
      /*月份变更*/
      onDateChange(monthStr) {
        console.log('onDateChange', monthStr)
        this.loadData(monthStr)
      },
      loadData (monthStr) {
        monthStr = monthStr || moment().format('YYYY-MM')
        let userId = this.$localStorage.get('userInfo').id
        let data = {
          createUser: userId,
          // pageNo: 1,
          // pageSize: 100,
          dataMonth: monthStr
        }
        this.selectDateList = []
        this.fetchService.examUserTopicMonthCalendar(data).then((res) => {
          if (res.code !== 0) {
            this.swipeData = []
            return this.tools.tip(res.message)
          }
          this.swipeData = res.data
          this.selectDateList = this.makeDateArray(this.swipeData)
        })
      },
      /*处理成日历组件的格式*/
      makeDateArray(list) {
        let ret = []
        list.forEach((v, i) => {
          let dateStr = moment(v).format('YYYY-M-D')
          if (ret.includes(dateStr)) return
          ret.push(dateStr)
        })
        return ret
      }
    }
  }
</script>

<style scoped lang="scss">
  @import "@/common/stylus/moon.scss";
</style>
